﻿<html>
    
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>
            产品管理
        </title>
        <link rel="stylesheet" href="./css/common.css" type="text/css" media="screen"/>
        <script type="text/javascript" src="./js/jquery-1.8.3.min.js"></script> 
        <style>
            .stayRight{
                text-align:right;
            }
        </style>
    </head>
    
    <body>
        <table  width=1000>
            <tfoot>
              <tr>
                <td colspan="7">
                  <div class="pagination"> 
                    <a href="#" title="First Page">« 第一页</a> 
                    <a href="#" title="Previous Page">« 上一页</a> 
                    <a href="#" class="number" title="1">1</a> 
                    <a href="#" class="number" title="2">2</a> 
                    <a href="#" class="number current" title="3">3</a> 
                    <a href="#" class="number" title="4">4</a> 
                    <a href="#" title="Next Page">下一页 »</a> 
                    <a href="#" title="Last Page">末页 »</a> 
                  </div>
                  
                </td>
              </tr>
            </tfoot>
            <tr>
                <td>ID</td>
                <td>产品名称</td>
                <td>产品类别</td>
                <td>产品规格</td>
                <td>产品单价 （￥）</td>
                <td>产品状态</td>
                <td>操作</td>
            </tr>
            <tr>
                <td>1</td>
                <td class='pdtName'>沙拉米斯</td>
                <td>树木</td>
                <td>棵</td>
                <td class='stayRight'>10.56</td>
                <td>普通产品</td>
                <td><div class='button' onclick='clickModify(this);'>修改</div> <div class='button'>删除</div></td>
            </tr>
            <tr>
                <td>2</td>
                <td>兰瑟加仑</td>
                <td>飞机</td>
                <td>架</td>
                <td class='stayRight'>988888</td>
                <td>促销产品</td>
                <td><div class='button'>修改</div> <div class='button'>删除</div></td>
            </tr>
            <tr>
                <td>3</td>
                <td>迈凯轮</td>
                <td>车辆</td>
                <td>辆</td>
                <td class='stayRight'>1076000.00</td>
                <td>普通产品</td>
                <td><div class='button'>修改</div> <div class='button'>删除</div></td>
            </tr>
        </table>
        
        
        <div class="messages" >
            
                <h3 style="display:inline-block;">产品名称: </h3> <h4 style="display:inline-block;">迈凯轮</h4><br/>
                <br/><p>产品单价: （￥）</p>
                <input type='text'/><br/><br/>
        
                <p>产品状态: </p>
                <select>
                <option>普通产品</option>
                <option>促销产品</option>
                </select><br/><br/>
        
                <div class='button'>提交</div>
        </div>
        
    </body>
    <script>
    var a=0;
    $('.messages').hide();
    function clickModify(gg){
        if(a==0){
            $('.messages').show();
            a=1;
        }
        else {
            $('.messages').hide();
            a=0;
        }
        $('.messages h4').html($(gg).parent().parent().children('.pdtName').html());
    }
    
    </script>

</html>